<template>
  <div class="product-details">
    <common-header />
    <div class="app-container contain">
      <div class="product-details-contain">
        <product-info />
        <product-desc />
        <product-comment />
        <product-bottom />
      </div>
      <store-info />
    </div>
    <icon-tips />
    <common-footer />
  </div>
</template>
<script setup>
import CommonHeader from "@/components/common/CommonHeader.vue";
import ProductDesc from "@/components/productDetail/ProductDesc.vue";
import StoreInfo from "@/components/productDetail/StoreInfo.vue";
import IconTips from "@/components/common/IconTips.vue";
import CommonFooter from "@/components/common/CommonFooter.vue";
import ProductComment from "@/components/productDetail/ProductComment.vue";
import ProductBottom from "@/components/productDetail/ProductBottom.vue";
import ProductInfo from "@/components/productDetail/ProductInfo.vue";
</script>
<style scoped>
.contain {
  display: flex;
}
.product-details-contain {
  align-items: flex-start;
}
</style>